<template>
  <a-modal v-model="visible" title="取消" :width="700" centered @ok="handleSubmit" destroyOnClose class="return-modal">
    <a-form>
      <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="取消原因：" required>
        <a-select v-model="reason" placeholder="请选择">
          <a-select-option :value="index" v-for="(item, index) in reasonList" :key="index">{{ item }}</a-select-option>
        </a-select>
      </a-form-item>
      <a-button @click="warning">失败</a-button>
    </a-form>
  </a-modal>
</template>
<script>
export default {
  data() {
    return {
      visible: false,
      labelCol: {
        xs: { span: 4 },
        sm: { span: 3 }
      },
      wrapperCol: {
        xs: { span: 12 },
        sm: { span: 12 }
      },
      reasonList: [],
      reason: ''
    }
  },
  methods: {
    show() {
      this.visible = true
    },
    handleSubmit() {},
    warning() {
      this.$warning({
        title: 'This is a warning message',
        content: 'some messages...some messages...',
        centered: true
      })
    }
  }
}
</script>
<style src="../less/modal.less" lang="less" scoped></style>
